<template>
  <view class="bg">
    <view class="notice_list">
      <view
        class="notice_list_item"
        @click="onLongPress(i.projectId)"
        v-for="(i, index) in projectList"
        :key="index"
      >
        <view>
          <image
            style="width: 24px; height: 24px; border-radius: 4px"
            src="@/static/ico_message.png"
          />
        </view>
        <view style="flex: 1; width: 90%; margin-left: 14px">
          <view class="notice_title text-elli">{{ i.company }}</view>
          <view class="notice_title text-elli">{{ i.projectName }}</view>
          <!-- <view class="notice_content text-elli-2">{{simpleNotice(i.content)}}</view> -->
          <view class="flex-between text-grey" style="margin-top: 10px">
            <view class="date">{{
              "项目周期:" + i.startDate + "-" + i.endDate
            }}</view>
            <span>{{
              i.projectStatus == "UN_COMPLETION" ? "进行中" : "已结项"
            }}</span>
          </view>
        </view>
      </view>
    </view>
    <view class="tip"> 已显示全部</view>
    <u-button
      v-if="roleType == 'SYSTEM_ADMIN' || roleType == 'PROJECT'"
      @click="addProject"
      class="addbtn"
      >+</u-button
    >
  </view>
</template>

<script>
import { pageProject, delProject } from "@/api/projectManager.js";
export default {
  data() {
    return {
      roleType: uni.getStorageSync("roleType"),
      projectList: [],
    };
  },
  onLoad() {
    this.getCustomerList();
  },
  methods: {
    onLongPress(id) {
      uni.navigateTo({
        url: "/pages/projectManager/addProject?projectId=" + id,
      });
    },
    async deleCustomer(id) {
      console.log(id);
      const res = await delCustomer({
        customerId: id,
      });
      this.getCustomerList();
    },
    addProject() {
      uni.navigateTo({
        url: "/pages/projectManager/addProject",
      });
    },
    routeTo(id) {
      // uni.navigateTo({
      // 	url: 'notice_info?id='+id
      // });
    },
    async getCustomerList() {
      uni.showLoading({
        title: "请稍等...",
      });
      var res = null;
      try {
        res = await pageProject({
          page: {
            pageNum: 1,
            pageSize: 100,
          },
          params: {},
        });
        console.log(res.data);
        this.projectList = res.data.list;
      } catch (err) {
        console.log(err);
      } finally {
        uni.hideLoading();
      }
    },
    // simpleNotice(content){

    // 	let newcontent = content.replace('<p>','').replace('</p>','');

    // 	let reg = /<(.*?)>/gms;
    // 	// console.log(reg.exec(newcontent));
    // 	newcontent = newcontent.replace(reg,'')

    // 	return newcontent;
    // },
  },
};
</script>

<style>
.bg {
  background-color: #fafafa;
  width: 100%;
}
.text-elli {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.text-elli-2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.flex-between {
  display: flex;
  justify-content: space-between;
}
.text-grey {
  color: #b2b2b2;
  font-size: 12px;
}
.notice_list {
  border: 1px solid #fafafa;
  border-radius: 5px;
}
.notice_list_item {
  background-color: #fff;
  border: 1px solid #fff;
  border-radius: 4px;
  margin-bottom: 14px;
  padding: 16px 14px;
  display: flex;
  margin: 14px;
}
.tip {
  text-align: center;
  font-size: 13px;
  color: #b2b2b2;
}
.peg {
  color: #2d89e5;
}
.notice_title {
  font-weight: bold;
  color: #333;
  font-size: 15px;
}
.notice_content {
  color: #999;
  font-size: 12px;
  margin-top: 5px;
}
.addbtn {
  position: fixed; /* 使按钮保持固定位置 */
  bottom: 50px; /* 距离底部20像素 */
  right: 20px; /* 距离右侧20像素 */
  background-color: #007bff; /* 背景颜色 */
  color: white; /* 文本颜色 */
  border: none; /* 无边框 */
  border-radius: 50%; /* 圆形按钮 */
  padding: 15px; /* 填充 */
  width: 50px;
  height: 50px;
  cursor: pointer; /* 鼠标光标变为指针 */
  z-index: 999; /* 确保按钮在最上层 */
}
</style>
